@charset "utf-8";
@media screen and (min-width:1921px){
  :root{
    font-size: 20px;
  }
}
@media screen and (max-width:1680px){
  :root{
    font-size: 14px;
  }
}
@media screen and (max-width:1440px){
  :root{
    font-size: 12px;
  }
  .wrapper section:not(.slideshow){ padding: 5vw;}
  .inner .inner-title .slogan .en{ display: none;}
  section.party{ background-size: auto 90%;}
  section.party .inner-content .graphic .swiper-pagination{ left: calc(36vw + 2rem);}
  footer{ padding: 4rem 5vw;}
}
@media screen and (max-width:1280px){
  section.party .inner-content .graphic .swiper-pagination{ left: 2rem;}
}
@media screen and (max-width:1024px){
  :root{
    font-size: 14px;
  }
  nav,
  header .quick{ display: none;}
  header,
  header.mini{ padding: 2.5vw;}
  .menu{ height: 3rem;}
  .menu,
  .menu.mini{ top: 2.5vw;}
  .logo a img{ height: 3rem;}

  .video .ico{ display: none;}
  .video .cover{ height: 10em}

  .menubox .grid{ padding: 5vw;}
  .menubox .grid .navigation{ width: 100%;}
  .menubox .grid .navigation ul{ grid-gap: 5vw}
  .menubox .grid .navigation ul li:before{ display: none;}
  .menubox .grid .navigation ul li .sub{ display: flex; flex-flow: row wrap; gap: 2.5vw; width: 100%;}
  .menubox .grid .contact,
  .menubox .grid .copyright{ display: none;}
  
  section.slideshow:before, section.slideshow:after, section.slideshow .line{ display: none;}
  section.slideshow .slogan-c{ left: 5vw; width: 90vw;}
  section.slideshow .slogan-c .cn{ font-size: 2rem;}
  section.slideshow .slogan-e{ bottom: 10%; right: 5vw;}
  section.slideshow .swiper-pagination .pagination{ grid-gap: 0;}
  section.slideshow .swiper-number{ bottom: 5vw; left: 5vw;}
  section.slideshow .design{ right: 5vw; bottom: 5vw;}
  section.slideshow .swiper-control,
  section.slideshow .scroll{ display: none;}
  section.slideshow .slogan-c .details{ display:none;}

  .inner{ grid-gap: 5vw;}
  .inner .inner-title{ grid-column: span 12; width: 100%;}
  .inner .inner-title .caption{ grid-gap: 0;}
  .inner .inner-title .caption .cn{ font-size: 1.25rem;}
  .inner .inner-title .caption .en{ grid-row: 2/3; font-size: .875rem;}
  .inner .inner-title .slogan{ position: absolute; top: .5rem; right: 0;}
  .inner .inner-title .slogan .cn{ line-height: 1.5;}
  .inner .inner-content{ grid-column: span 12; width: 100%;}
  
  section.news .inner-control{ display: none;}
  section.news .inner-content a{ grid-gap: 5vw; padding: 5vw;}
  section.news .inner-content .swiper .swiper-slide{ width: 92.5vw;}
  

  section.about .inner .cover{ grid-column: span 12; grid-row: 2 / 3; height: calc((90vw / 16 * 9));}
  section.about .inner .cover:before,
  section.about .inner .cover:after,
  section.about .inner .cover .control{ display: none;}
  section.about .inner .cover .swiper{ position: relative; bottom: 0;}
  section.about .inner .logo{ grid-column: span 12;}
  section.about .inner .info{ grid-column: span 12;}
  section.about .inner .more{ grid-column: span 12;}
  section.about .inner .cate{ grid-column: span 12; grid-template-columns: repeat(2,1fr); padding: 0;}
  section.about .inner .cate a{ padding: 2.5vw 5vw;}
  section.about .inner .cate a .ico{ display: flex; justify-content: center; align-items: center; width: 2rem; height: 100%; font-size: 1.5rem;}

  section.field .inner-content{ grid-template-columns: repeat(2,1fr);}
  section.field .inner-content a{ padding-bottom: 100%;}
  section.field .inner-content a .info{ grid-template-columns: 1fr auto; padding: 5vw;}
  section.field .inner-content a .info .ico{ bottom: 5vw; left: 5vw;}
  section.field .inner-content a .info .en{ right: 5vw; bottom: 5vw;}

  section.engineering .inner-title{ position: relative; grid-column: span 12; justify-items: start;}
  section.engineering .inner-title .caption{ justify-items: start;}
  section.engineering .inner-content .swiper-cover{ grid-column: span 12;}
  section.engineering .inner-content .swiper-cover .itm .cover{ grid-column: span 10;}
  section.engineering .inner-content .swiper-cover .itm .info{ grid-column: span 10; padding: 2.5vw 0;}
  section.engineering .inner-content .swiper-cover .itm .info .more{ margin-top: 0;}
  section.engineering .inner-content .swiper-thumb{ grid-column: span 12; position: relative; bottom: 0; width: calc(100% + 5vw); margin-right: -5vw;}
  section.engineering .inner-content .swiper-thumb .swiper-slide{ width: calc(10rem + 2.5vw); padding-right: 2.5vw;}
  section.engineering .inner-content .swiper-pagination{ grid-column: 10 / 13; top: calc((90vw / 16 * 9) + 5vw); bottom: auto;}
  section.engineering .inner-content .swiper-control{ display: none;}
  
  section.number-ad{ grid-gap: 5vw;}
  section.number-ad .slogan{ grid-column: span 12; grid-gap: 2.5vw;}
  section.number-ad .slogan a.more{ margin-top: 0;}
  section.number-ad .num{ grid-column: span 12; display: flex; flex-flow: row wrap; justify-content: flex-start; grid-gap: 3vw;}
  section.number-ad .num .itm{ width: 28vw; grid-template-columns: auto 1fr;}
  section.number-ad .num .itm span{ font-size: 0.875rem;}
  section.number-ad .num .itm b{ font-size: 1.75rem;}

  section.party .inner-title .caption .cn:before{ display: none;}
  section.party .inner-content .graphic{ grid-column: span 10;}
  section.party .inner-content .graphic a{ grid-gap: 0;}
  section.party .inner-content .graphic a .cover{ grid-column: span 7;}
  section.party .inner-content .graphic a .info{ grid-column: span 7; grid-gap: 2.5vw; width: 100%; margin-left: 0; padding: 5vw;}
  section.party .inner-content .graphic a .info .date{ display: none;}
  section.party .inner-content .graphic .swiper-pagination{ top: calc(90vw / 16 * 9 - 5vw); right: 5vw; bottom: auto; left: auto;}
  section.party .inner-content .list{ grid-column: span 10; grid-gap: 2.5vw;}
  section.party .inner-content .list a{ grid-gap: 5vw; padding: 5vw;}
  section.party .inner-control{ display: none;}

  footer{ padding: 5vw; grid-gap: 5vw; background: url('../img/footer.webp') center center no-repeat #0A224D; background-size: 100% auto;}
  footer .service{ flex-flow: column nowrap;}
  footer .service .logo{ display: none;}
  footer .service .adv{ display: flex; flex-flow: row wrap; gap: 5vw;}
  footer .service .adv .itm{ grid-template-columns: auto 1fr; grid-gap: 0 2.5vw; width: 42.5vw; overflow: hidden;}
  footer .service .adv .itm .ico{ display: flex; justify-content: center; align-items: center; width: 2rem; height: 100%; font-size: 1.75rem;}
  footer .content{ flex-flow: column; grid-gap: 5vw;}
  footer .content .title{ position: relative; width: 100%;}
  footer .content .title .caption{ grid-gap: 0;}
  footer .content .title .caption .en{ grid-row: 2 / 3;}
  footer .content .title .quick{ position: absolute; top: 0.5rem; right: 0; padding-top: 0;}
  footer .content .sitemap{ display: flex; flex-flow: row wrap; grid-gap: 2.5vw; justify-content: space-between;}
  footer .content .sitemap .itm{ min-width: 20%;}
  footer .content .qrcode{ display: none;}
  footer .cpy{ flex-flow: column; align-items: flex-start; gap: .5rem}

  /* sub */

  .sub .banner{ height: 56.25vw; justify-content: center;}
  .sub .banner .catename{ justify-items: center; grid-gap: 1.25vw;}
  .sub .banner .catename .cn{ grid-row: 1 / 2; font-size: 1.5rem;}
  .sub .banner .catename .strip{}
  .sub .banner .catename .en{ grid-row: 3 / 4; font-size: 1rem;}
  .sub .banner .slogan{ display: none;}
  
  .sub .category{ flex-flow: row wrap; justify-content: flex-start; gap: 2.5vw 5vw; padding: 2.5vw 5vw; font-size: 1rem;}
  .sub .category a{ margin: 0;}

  .sub .title .caption .cn{ font-size: 1.25rem; font-weight: 700;}
  .sub .title .caption .en{ grid-row: 2 / 3; font-size: 0.875rem; }

  .sub .about-col{ padding: 5vw;}

  .sub .about-intro .content:after{ display: none;}
  .sub .about-intro .content p:nth-child(2){ display: none;}
  .sub .about-intro .content p:not(:last-child){ margin-bottom: 1rem; font-size: 1.125rem;}
  .sub .about-intro .content .cover{ width: 100%; height: auto; margin: 0; margin-bottom: 1rem;}

  .sub .about-number .title{ display: none;}
  .sub .about-number .content{ grid-column: span 12; display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 5vw;}

  .sub .about-video{ height: 56.25vw;}
  
  .sub .about-leader{ grid-template-columns: 1fr;}
  .sub .about-leader .title{ grid-column: span 1;}
  .sub .about-leader .cover{ grid-column: span 1;}
  .sub .about-leader .content{ grid-column: span 1; grid-row: 4/5;}
  .sub .about-leader .content p:not(:first-child){  margin-top: 1rem; font-size: 1.125rem;}
  .sub .about-leader .content p:first-child{ font-size: 1.25rem;}

  .sub .about-culture .content{ grid-template-columns: 1fr; grid-gap: 2.5vw; background: none;}
  .sub .about-culture .content .blank,
  .sub .about-culture .content .blank-b{ display: none;}
  .sub .about-culture .content .itm{ padding: 5vw 0; background: var(--primary);}

  .sub .engineering-col{ padding: 5vw; grid-gap: 5vw;}
  .sub .engineering-col .row{ grid-gap: 5vw;}
  .sub .engineering-col .row .title{ position: relative; grid-template-columns: 1fr; grid-auto-flow: row; grid-gap: 2.5vw; padding: 5vw;}
  .sub .engineering-col .row .title .number{ position: absolute; top: 5vw; right: 5vw;}
  .sub .engineering-col .row .title .ico{ grid-row: 1 / 2; justify-self: start;}
  .sub .engineering-col .row .title a.more{ justify-self: start;}
  .sub .engineering-col .row .content{ grid-gap: 5vw;}
  .sub .engineering-col .row .content .itm{ grid-column: span 3; grid-gap: 2.5vw;}

  .sub .honor-row{ grid-template-columns: 1fr;}
  .sub .honor-row .col.font{ grid-column: span 1;}
  .sub .honor-row .col.tab{ grid-column: span 1; grid-template-columns: 1fr;}
  .sub .honor-row .col .tab-nav{ display: grid; grid-template-columns: repeat(2,1fr);}
  .sub .honor-row .col .tab-nav .itm{ height: auto; padding: 5vw 0;}
  .sub .honor-row .col .tab-nav .itm br{ display: none;}
  .sub .honor-row .col .tab-con .swiper-slide .list{ grid-template-columns: 1fr;}

  .sub .news-col{ padding: 5vw;}
  .sub .news-col .list{ grid-gap: 5vw;}
  .sub .news-col .list .slide-news a{ grid-template-columns: 1fr;}
  .sub .news-col .list .slide-news a .info{ padding: 5vw; grid-gap: 2.5vw;}
  .sub .news-col .list .slide-news a .info .date{ display: none;}
  .sub .news-col .list .slide-news a .info .tit{ margin-top: 0; font-size: 1rem;}
  .sub .news-col .list .slide-news a .info .desc{ font-size: 0.875rem;}
  .sub .news-col .list .slide-news a .info .more{ margin-top: 0;}
  .sub .news-col .list .slide-news .swiper-control{ display: none;}
  .sub .news-col .list .itm{ grid-column: span 3; grid-gap: 5vw; padding: 5vw;}

  .sub .party-col{ padding: 5vw; grid-gap: 5vw;}
  .sub .party-col .party-union,
  .sub .party-col .party-typical,
  .sub .party-col .party-spir{ grid-column: span 12;}

  .sub .party-col .graphic .font{ grid-gap: 2.5vw; padding: 2.5vw 0;}

  .sub .party-col .headlines .cover{ grid-column: span 8;}
  .sub .party-col .headlines .info{ grid-column: span 8; grid-gap: 2.5vw; width: 100%; padding: 5vw; margin-left: 0;}
  .sub .party-col .headlines .info .date{ display: none;}

  .sub .party-col .party-work .content{ grid-gap: 2.5vw;}
  .sub .party-col .party-work .content .headlines{ grid-column: span 12;}
  .sub .party-col .party-work .content .itm{ grid-column: span 12; grid-gap: 5vw; padding: 5vw;}

  .sub .party-col .party-union .content{ grid-gap: 2.5vw;}
  .sub .party-col .party-union .content .graphic{ grid-column: span 2; grid-row: span 1;}
  .sub .party-col .itm{ grid-column: span 2; grid-gap: 5vw; padding: 5vw;}

  .sub .party-col .party-typical .content{ grid-gap: 2.5vw;}

  .sub .party-col .party-spir .content{ grid-template-columns: 1fr; grid-gap: 2.5vw;}

  .sub .party-col .party-special .swiper-slide{ width: 92.5vw;}

  .sub .resources-col{ padding: 5vw;}
  .sub .resources-col .list{ grid-template-columns: 1fr;}
  .sub .resources-col .list .itm{ padding: 5vw;}

  .sub .tech-col{ padding: 5vw;}
  .sub .tech-col .list{ grid-template-columns: 1fr; grid-gap: 5vw;}

  .sub .educ-col{ padding: 5vw;}
  .sub .educ-col .list{ grid-template-columns: 1fr; grid-gap: 5vw;}
  .sub .educ-col .list .itm .info{ padding: 5vw;}

  .sub .project-col{ padding: 5vw;}
  .sub .project-col .list{ grid-template-columns: 1fr; grid-gap: 5vw;}
  .sub .project-col .list .itm{ grid-template-columns: 1fr; grid-gap: 0;}
  .sub .project-col .list .itm .info{ margin: 0; padding: 5vw;}

  .sub .pagenumber .prev, .sub .pagenumber .next{ width: 3rem;}

  .sub .column .article-col .article .arrow a:first-child{ display: none;}
  
  .sub .column .list-col{ padding: 5vw;}
  .sub .column .list-col .list-page{ grid-template-columns: 1fr; grid-gap: 5vw;}
  

}